<!DOCTYPE>
<html lang="en">
<head>
    <meta http-equiv="Content-Type" content="text/html;charset=UTF-8">
    <title>处理审批</title>
    <link rel="stylesheet" href="/static/lib/layui/css/layui.css" media="all">
    <link rel="stylesheet" type="text/css" href="/static/plugin/layer/skin/layer.css">
    <link rel="stylesheet" type="text/css" href="/static/css/dj-css.css">
    <style>
        /*公共样式*/
        .fl {
            float: left;
        }

        .x-red {
            color: red;
        }

        .layui-form-item {
            line-height: 38px;
        }

        body {
            background: #f4f6f8;
            padding-top: 16px;
            padding-left: 20px;
        }

        .clearfix {
            zoom: 1;
        }

        .clearfix:after {
            display: block;
            height: 0;
            visibility: hidden;
            opacity: 0;
            clear: both;
            content: '';
        }

        /*本页面样式*/
        h2 {
            font-size: 18px;
            font-weight: bold;
            line-height: 32px;
            margin-right: 20px;
            background: #fff;
            padding: 18px 0 18px 18px;

        }

        h2:after {
            display: block;
            content: "";
            float: left;
            width: 4px;
            height: 32px;
            background-color: #35a3e5;
            margin-right: 15px;
        }

        .appliant {
            height: 30px;
            line-height: 30px;
            padding: 13px 0;
            margin-top: 20px;
            margin-right: 20px;
            background-color: #fff;;
        }
        .appliant label{
            margin:0 50px;
            display: inline-block;
            font-size:16px;
            color:#333;
        }
        .appliant label span{
            font-size:14px;
            color:#666;
        }
        .appliant label:after{
            display: block;
            float: right;
            margin-right: -50px;
            content:'';
            width:1px;
            height:30px;
            background-color: #ddd;
        }
        .appliant label:last-child:after{
            display: none;
        }
        .applyReason {
            margin: 20px 20px 0 0;
            padding: 20px 36px;
            background-color: #fff;
        }

        .applyReason h5 {
            font-size: 16px;
            color: #333;
        }

        .applyReason p {
            font-size: 14px;
            color: #666;
            text-indent: 2em;
            text-align: justify;
        }

        .main {
            margin-top: 20px;
            margin-right: 20px;
            padding: 22px 36px 40px 36px;
            background: #fff;
        }

        h4 {
            padding-bottom: 20px;
            font-size: 16px;;
        }

        textarea {
            height: 220px;
            width: 90%;
            padding: 16px;
            border-color: #ddd;
            font-size: 16px;
        }

        .operate {
            margin-top: 30px;
            font-size: 0;
        }

        .operate .submit {
            font-size: 16px;
            background-color: #35a3e5;
        }

    </style>
</head>
<body>
<div id="createApp">

    <h2>处理审批</h2>
    <div class="appliant">
        <label>申请人：<span>董浩柯</span></label>
        <label>申请时间：<span>2017-09-12</span></label>
        <label>请假类型：<span>事假</span></label>
        <label>开始时间：<span>2017-09-12</span></label>
        <label>结束时间：<span>2017-09-12</span></label>
    </div>
    <div class="applyReason">
        <h5>请假原因：</h5>
        <p>原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因原因</p>
    </div>
    <div class="main">
        <h4>审批意见：</h4>
        <textarea name="" id="reason" cols="30" rows="10" placeholder="审批意见必填~"></textarea>
        <div class="layui-form-item operate">
            <button class="layui-btn submit" lay-submit="" lay-filter="demo2" @click="sub">提交审批</button>
        </div>
    </div>
</div>
<script src="/static/lib/jquery.min.js"></script>
<script src="/static/lib/layui/layui.js" charset="utf-8"></script>
<script src="/static/lib/vue.min.js"></script>
<script src="/static/lib/x-layui.js"></script>
<script src="/static/lib/dj-js.js"></script>
<script type="text/javascript">


    var myid = "${department.id}"
    if (myid == "") {
        var kid = ""
    } else {
        kid = "$!{department.id}"
    }
    var VM = new Vue({
        el: "#createApp",
        created: function () {
//            this.lay();
//            this.getDeptList();
        },
        data: {

            parameter: {
                "leave_type": "",
                "start_time": '',
                "end_time": "",
                "reason": ""
            }
        },
        methods: {
            lay: function () {
                layui.use(['layer', "form", 'laydate'], function () {
                    var form = layui.form(),
                            layer = layui.layer,
                            laydate = layui.laydate;
                    form.on('checkbox(allChoose)', function (data) {
                        var child = $(data.elem).parents('table').find('tbody input.checkbox');
                        child.each(function (index, item) {
                            item.checked = data.elem.checked;
                        });
                        form.render('checkbox');
                    });

                });
            },
            verify: function (item) {
                if (item == "") {
                    layer.msg("必填项不能为空！", {icon: 5});
                    return false;
                }
            },
            sub: function () {
                var _this = this;
                this.parameter.leave_type = $("#leave_type").html();
                this.parameter.start_time = $("#LAY_demorange_s").val();
                this.parameter.end_time = $("#LAY_demorange_e").val();
                this.parameter.reason = $("#reason").val();
                $.ajax({
                    type: "post",
                    url: "../../activiti/startleave.do",
                    data: _this.parameter,
                    dataType: "json",
                    success: function (data) {
                        layer.msg("提交成功！", {icon: 1});
//                        var index = parent.layer.getFrameIndex(window.name); //获取窗口索引
//                        parent.layer.close(index);
//                        parent.window.location.reload();
//                        window.location.href = "javascript:location.replace(location.href)";
                    }
                });
            },
            reset: function () {
                $("#leave_type").html("请选择请假类型");
                $("#leave_type").attr("selectedCode", "");
                $(".dj-select-list li").removeClass("selected");
                $("#LAY_demorange_s").val("");
                $("#LAY_demorange_e").val("");
                $("#reason").val("");
            }
        }
    });//vue 实例结束

    layui.use('laydate', function () {
        var laydate = layui.laydate;
        $("#LAY_demorange_s").val(laydate.now());
        $("#LAY_demorange_e").val(laydate.now());


    });

</script>
</body>
</html>